MT7049 การออกแบบและฐานข อม ลบนเว บ

Transcription

1 MT7049 การออกแบบและฐานข อม ลบนเว บ 3 (2-2-5) Web Design and Web Database ส พจน เฮงพระพรหม คาอธ บายรายว ชา แนวค ดองค ประกอบของเว บ หล กการออกแบบเว บ การว เคราะห เน อหา การออกแบบโครงสร างฐานข อม ล ว ธ การจ ดการข อม ลบนเว บ การ ประมวลผลและการแสดงผลข อม ล การใช โปรแกรมคอมพ วเตอร สร าง ฐานข อม ล เช น ภาษา PHP, MySQL การต ดต อส อสารบนเว บ เช น Web board Chat room ฝ กปฏ บ ต ออกแบบและการสร างฐานข อม ล บนเว บ 2 1

2 เน อหา บทท 1 ความร เบ องต นเก ยวก บเว บ บทท 2 การบร หารเว บไซต และการพ ฒนาเว บเพจด วย Dreamweaver เบ องต น บทท 3 การเข ยนโปรแกรมด วยภาษา PHP เบ องต น บทท 4 ต วแปรและต วดาเน นการ บทท 5 คาส งควบค มการท างาน บทท 6 ฟ งก ช น บทท 7 ต วแปรอาร เรย บทท 8 การสร างฟอร มร บและแลกเปล ยนข อม ล บทท 9 การแลกเปล ยนข อม ลด วย Session และ Cookie บทท 10 การจ ดการฐานข อม ล MySQL บทท 11 การต ดต อฐานข อม ล MySQL ด วย PHP บทท 12 ต วอย างการท าระบบงาน 3 การว ดผล จ ตพ ส ย 10 คะแนน งาน 30 คะแนน สอบเก บคะแนนระหว างภาค 30 คะแนน สอบเก บคะแนนปลายภาค 30 คะแนน 4 2

3 การประเม นผล 80 % ข นไป ระด บคะแนน A % ระด บคะแนน C % ระด บคะแนน B % ระด บคะแนน D % ระด บคะแนน B % ระด บคะแนน D % ระด บคะแนน C+ ต ากว า 50 % ระด บคะแนน E เอกสารประกอบการสอน ค ม อการใช งานโปรแกรม DreamWeaver และ ค ม อการพ ฒนา Web application ด วย PHP และ MySQL 5 Unit 1. Introduction to the Internet, Web and HTML Unit 1. Introduction to the Internet, Web and HTML 6 3

4 What is ICT ICT: Information and Communication Technology Information Technology: the application of computers and telecommunications equipment to store, retrieve, transmit and manipulate data Communication Technology: the activity of designing, constructing and maintaining communication systems Unit 1. Introduction to the Internet, Web and HTML 7 Computer network A telecommunications network that allows computers to exchange data Networked computing devices (network nodes) pass data to each other along data connections The connections (network links) between nodes are established using either cable media or wireless media The best-known computer network is the Internet Unit 1. Introduction to the Internet, Web and HTML 8 4

5 Internet The largest network in the world that connects hundreds of thousands of individual networks all over the world The popular term for the Internet is the information highway Rather than moving through geographical space, it moves your ideas and information through cyberspace the space of electronic movement of ideas and information Unit 1. Introduction to the Internet, Web and HTML 9 Internet (con.) No one owns it It has no formal management organization As it was originally developed by the Department of defense To access the Internet, an existing network need to pay a small registration fee and agree to certain standards based on the TCP/IP (Transmission Control Protocol/Internet Protocol) Unit 1. Introduction to the Internet, Web and HTML 10 5

6 The uses of the Internet Send messages Send (upload) or receive (download) files between computers Participate in discussion groups, such as mailing lists and newsgroups Surfing the web Unit 1. Introduction to the Internet, Web and HTML 11 What is Web? The Web (World Wide Web: WWW) consists of information organized into Web pages containing text and graphic images It contains hypertext links, or highlighted keywords and images that lead to related information A collection of linked Web pages that has a common theme or focus is called a Web site The main page that all of the pages on a particular Web site are organized around and link back to is called the site s home page Unit 1. Introduction to the Internet, Web and HTML 12 6

7 How to access the Internet? Many schools and businesses have direct access to the Internet using special high-speed communication lines and equipment Students and employees can access through the organization s local area networks (LAN) or through their own personal computers Another way to access the Internet is through Internet Service Provider (ISP) Unit 1. Introduction to the Internet, Web and HTML 13 How to access the Web? Once you have your Internet connection, then you need special software called a browser to access the Web. Web browsers are used to connect you to remote computers, open and transfer files, display text and images. Web browsers are specialized programs. Examples of Web browser: Netscape Navigator (Navigator) and Internet Explorer Unit 1. Introduction to the Internet, Web and HTML 14 7

8 Client/Server Structure of the Web Web is a collection of files that reside on computers, called Web servers, that are located all over the world and are connected to each other through the Internet When you use your Internet connection to become part of the Web, your computer becomes a Web client in a worldwide client/server network A Web browser is the software that you run on your computer to make it work as a web client Unit 1. Introduction to the Internet, Web and HTML 15 Client/Server Structure of the Web The client/server protocol used by the web is HTTP (HyperText Transport Protocol) Unit 1. Introduction to the Internet, Web and HTML 16 8

9 Hypertext Markup Language (HTML) The public files on the web servers are ordinary text files, much like the files used by word-processing software To allow Web browser software to read them, the text must be formatted according to a generally accepted standard The standard used on the web is Hypertext markup language (HTML) Unit 1. Introduction to the Internet, Web and HTML 17 HTML (con.) HTML uses codes, or tags, to tell the Web browser software how to display the text contained in the document. For example, a Web browser reading the following line of text: <B> A Review of the Book<I>Wind Instruments of the 18th Century</I></B> recognizes the <B> and </B> tags as instructions to display the entire line of text in bold and the <I> and </I> tags as instructions to display the text enclosed by those tags in italics. Unit 1. Introduction to the Internet, Web and HTML 18 9

10 Addresses on the Web: IP Addressing Each computer on the internet does have a unique identification number, called an IP (Internet Protocol) address The IP addressing system currently in use on the Internet uses a four-part number Each part of the address is a number ranging from 0 to 255, and each part is separated from the previous part by period For example, The combination of the four IP address parts provides 4.2 billion possible addresses (256 x 256 x 256 x 256) Unit 1. Introduction to the Internet, Web and HTML 19 Domain Name Addressing Most web browsers do not use the IP address t locate Web sites and individual pages. They use domain name addressing A domain name is a unique name associated with a specific IP address by a program that runs on an Internet host computer This program, which coordinates the IP addresses and domain names for all computers attached to it, is called DNS (Domain Name System ) software The host computer that runs this software is called a domain name server Unit 1. Introduction to the Internet, Web and HTML 20 10

11 Domain Name Addressing (con.) Domain names can include any number of parts separated by periods, however most domain names currently in use have only three or four parts Domain names follow hierarchical model that you can follow from top to bottom if you read the name from the right to the left For example, the domain name gsb.uchicago.edu is the computer connected to the Internet at the Graduate School of Business (gsb), which is an academic unit of the University of Chicago (uchicago), which is an educational institution (edu) No other computer on the Internet has the same domain name Unit 1. Introduction to the Internet, Web and HTML 21 Uniform Resource Locators (URL) The IP address and the domain name each identify a particular computer on the Internet However, they do not indicate where a Web page s HTML document resides on that computer To identify a Web pages exact location, Web browsers rely on Uniform Resource Locator (URL) URL is a four-part addressing scheme that tells the Web browser: What transfer protocol to use for transporting the file The domain name of the computer on which the file resides The pathname of the folder or directory on the computer on which the file resides The name of the file Unit 1. Introduction to the Internet, Web and HTML 22 11

12 Structure of a Uniform Resource Locators Unit 1. Introduction to the Internet, Web and HTML 23 Protocal The transfer protocol is the set of rules that the computers use to move files from one computer to another on the Internet The most common transfer protocol used on the Internet is the Hypertext Transfer Protocol (HTTP) Two other protocols that you can use on the Internet are the File Transfer Protocol (FTP) and the Telnet Protocol Unit 1. Introduction to the Internet, Web and HTML 24 12

13 How to create a web page? Unit 1. Introduction to the Internet, Web and HTML 25 How to create a web page? Look at main technological components that make up modern Web pages HTML HyperText Markup Language CSS Cascading Style Sheets JavaScript Etc. For each component What it is/isn't, can/can't do What kinds of constructs it comprises How to use it in Web pages How it interacts with other components Unit 1. Introduction to the Internet, Web and HTML 26 13

14 HTML Pages HTML pages are tag-based documents Really plain ASCII text files Don't look like documents they represent Tags indicate how processing program should display text and graphics Designed to describe hypertext, not paper Processed by browsers "on the fly" Tags usually appear in pairs Most have reasonable names or mnemonics Most can be modified by attributes/values Unit 1. Introduction to the Internet, Web and HTML 27 That's How This... Unit 1. Introduction to the Internet, Web and HTML 28 14

15 Some HTML Tag Examples START TAG END TAG <HTML> </HTML> <HEAD> </HEAD> <TITLE> </TITLE> <BODY> </BODY> <H1>, <H2>,... </H1>, </H2>,... <IMG...> </IMG> (optional) <A...> </A> <P> </P> (optional) <BR> (none; "empty" tag) <OL> </OL> <UL> </UL> <LI> </LI> (optional) Unit 1. Introduction to the Internet, Web and HTML 29 HTML Document Layout Unit 1. Introduction to the Internet, Web and HTML 30 15

16 Attributes and Values Most HTML tags can take attributes Format of value depends on attribute width="150"... href="page3.htm The tag that puts the HT in HTML <a>... </a> (useless by itself) Must have attributes to be useful <a href="mypage.htm">my Page</a> Whatever is between <a> and </a> is hot (clickable) Clicking makes the link go somewhere or do something Unit 1. Introduction to the Internet, Web and HTML 31 Images Images not in page; referenced by page Graphics are separate, required files Usually GIFs or JPGs, sometimes others Can be anywhere in document body: in paragraphs, headings, lists, anchors, etc. Place image with <img> tag Like <a>, <img> is useless by itself All work is done with attributes/values Unit 1. Introduction to the Internet, Web and HTML 32 16

17 Images (con.) Main attribute: SRC Tells page where to find the image File name can be local, relative, or full Case sensitivity depends on server Animated GIFs added same as static <img src="smiley.gif"> <img src="./pix/mypic.jpg"> Unit 1. Introduction to the Internet, Web and HTML 33 Tables A table is a container <table>... </table> That contains other containers (rows) <tr>... </tr> That contain other containers (cells) <td>... </td> (data cells) <th>... </th> (heading cells) That contain data or other containers Text, graphics, lists, even other tables! Unit 1. Introduction to the Internet, Web and HTML 34 17

18 Tables (con.) Basic table markup <table border="1"> <tr> <td>row 1, Cell 1</td> <td>row 1, Cell 2</td> </tr> <tr> <td>row 2, Cell 1</td> <td>row 2, Cell 2</td> </tr> </table> Row 1, Cell 1 Row 1, Cell 2 Row 2, Cell 1 Row 2, Cell 2 Unit 1. Introduction to the Internet, Web and HTML 35 Assignment Create webpages as follows: Main Page Training About Me Unit 1. Introduction to the Internet, Web and HTML 36 18